<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>汤汤专属</title>
  <link rel="stylesheet" href="style.css">
  <style>
    .content {
      background: #fff;
    }

    .content .text {
      flex-basis: 60%;
    }

    .content h2{
      margin-top: 15px;
    }

    .content .text p{
      margin-top: 15px;
      font-size: 15px;
      line-height: 40px;
    }

    .content .photo ul {
      display: flex;
      justify-content: space-between;
      gap: 30px;
      align-items: center;
    }

    .content .photo ul li {
      flex-basis: calc((100% - 30px* 2) / 3);
    }

    .content .photo ul li img {
      width: 100%;
      height: 230px;
      object-fit: cover;
    }
  </style>
</head>
<body>
  <div class="wrapin">
    <!--头部-->
    <header>
      <ul class="nav">
        <li><a href="index.html">首页</a></li>
        <li><a href="juqing.html">剧情简介</a></li>
        <li><a href="juese.html">主人公介绍</a></li>
        <li><a href="tupian.html">图片鉴赏</a></li>
        <li><a href="jingcai.html">精彩片段</a></li>
      </ul>
    </header>

    <!-- 图片 -->
    <div class="banner"> <img src="images/1.jpg" /> </div>

    <!--内容-->
    <div class="content">
      <div class="text">
        <h2>海绵宝宝</h2>
        <P>海绵宝宝（SpongeBob SquarePants），美国动画《海绵宝宝》及其衍生作品中的角色。
          生活在太平洋海底一座被称为比基尼海滩的城市，身份是蟹堡王的高级厨师。黄色长方形海绵，其身体构成如同清洁用海绵。拥有两只手，各四根手指。以棕色短裤、白色衬衫和红色领带为主要服装。身体如果被破坏皆可恢复原状。虽然有正常进食，但纯滤食海水也能继续存活。体力薄弱，且所谓的哑铃其实是绒毛玩具；但随着剧情发展似乎逐渐提升，奇怪的是他在与珊迪用空手道对打时完全看不出体质的薄弱，两人平分秋色。平常喜欢说的口头禅是：“我准备好了”</P>
      </div>
      <div class="photo">
        <h2>图片鉴赏</h2>
        <ul>
          <li><img src="images/3.jpg" /></li>
          <li><img src="images/4.jpg" /></li>
          <li><img src="images/5.jpg" /></li>
        </ul>
      </div>

      <!--底部-->
      <footer>
        <p>海绵宝宝</p>
      </footer>
    </div>
</body>

</html>